.hubzy_center
	flex: 4
	position: relative
	display: flex
	flex-direction: column
	min-height: 80vh
	overflow-wrap: break-word
	overflow-x: clip
	padding: 0 20px
	.post
		.content	
			padding:14px 60px
			.nubScript
				color: var(--color-meta)
				font-size: 12px


	.img-pup
		width: 100vw
		height: 100vh
		z-index: 99999999
		position: fixed
		top: 0
		left:0
		background-color: rgba(0,0,0,0.65)
		display: flex
		align-items: center
		justify-content: center; 
		cursor pointer
		img
			display: block
			max-width : 90vw;
			max-height: 90vh;
			width: auto;
			height: auto;
	.hubzy_center_title
		height: 80px
		display: flex
		padding:14px 0px
		width: 100%
		align-items: center
		position: sticky
		top: 0
		background-color: var(--color-background-op)
		backdrop-filter: blur(15px)
		z-index: 99
		flex-wrap: wrap;
		box-sizing: border-box
		a
			background: none
			color: inherit
			text-decoration: none
		#logo
			display: inline-block
			float: left
			margin-right: 20px
			width: $logo-width
			height: $logo-height
			border-radius: 5px
			background-size: $logo-width $logo-height
			background-repeat: no-repeat
		h1
			color: var(--color-text);
			margin: 0
			line-height: 28px
		.posttitle
			width: 100%
		.meta
			width: 100%
			margin: 0
		.nav_right
			display: flex
			flex-direction: column

			ul
				display: flex
				flex-wrap: wrap
				margin: 0
				padding: 0
				list-style-type: none
				line-height: 15px
				a
					display: block
					margin-right: 15px
					color: var(--color-text)

				a:hover
					underline(5px, $color-accent-1)

					color: var(--color-link)

				li
					display: inline-block
					margin-right: 15px
					border-color: var(--color-text)
					border-right: 1px dotted
					vertical-align: middle

				.icon
					display: none

				li:last-child
					margin-right: 0
					border-right: 0

					a
						margin-right: 0
.post-list
	padding: 0

	.post-item
		align-items: center
		margin-bottom: 1rem
		margin-left: 0
		list-style-type: none
		display: flex
		justify-content: space-between
		margin-bottom: 6px
		.title
			position: relative
			width: 100%

		a
			display: block

			span
				background-color: var(--color-background)
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
		
		.slug::before
			position: absolute
			top: 50%
			right: 0
			z-index: -1
			width: 100%
			border-bottom: 1px dashed var(--color-meta)
			content: " "
			opacity: .35

		.meta
			z-index: 1
			display: block
			height: fit-content
			color: var(--color-meta)
			font-size: .8rem

		time
			display: grid
			width: 5rem
			background-color: var(--color-background)
			text-align: left

.project-list
	padding: 0
	list-style: none

	.project-item
		margin-bottom: 6px

		p
			display: inline
.post-year
	list-style-type: none


.pagination
	display: inline-block
	margin-top: 2rem
	margin-bottom: 1rem
	width: 100%
	text-align: center

	.page-number
		color: var(--color-text)
		font-size: .8rem

	a
		padding: 4px 6px
		border-radius: 5px
		background-image: none
		color: var(--color-text)
		text-decoration: none

	a:hover
		background-image: none

	a:hover:not(.active)
		color: var(--color-accent-2)
a 
	cursor pointer